import React, {useEffect, useState} from 'react';
import {getUserLable, UpdateUserLabel} from "@/services/ant-design-pro/users";
import {message, Modal, Form} from "antd";
import ProFrom, {ProFormSelect} from '@ant-design/pro-form';


const SingleLevel = (props) => {
  const {consLevel,leveCancel,handleOk,levelInto} = props
  const [levelList,setLevelList] = useState([])
  const [form] = Form.useForm();

  // 用户标签的列表
  useEffect(async ()=>{
   const list = await getUserLable();
    let items = list.data.map(item =>{
     return {
       label:item.label_name,
       value:item.id
     }
   })

    setLevelList(items)
  },[])


  return (
    <div>
      <Modal
        visible={consLevel}
        title='请选择用户标签'
        destroyOnClose={true}
        onOk={ ()=>{
          form.validateFields().then(async values=>{
            handleOk(values)
          })
        }}
        onCancel={leveCancel}
      >
        <ProFrom
          form={form}
          submitter={false}
          initialValues={levelInto}
        >
          <ProFormSelect
            name="label_id"
            label="标签名称"
            mode='tags'
            options={levelList}
            placeholder="请选择用户标签"
            rules={[{ required: true, message: '请选择用户标签!' }]}
          />
        </ProFrom>
      </Modal>
    </div>
  );
};

export default SingleLevel;
